<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib prefix="sec" uri="http://www.springframework.org/security/tags"%>
<%@ page session="true" %>

<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Home</title>
<!-- Bootstrap CSS -->
<link href="<c:url value="resources/bootstrap/css/bootstrap.min.css"/>" rel="stylesheet" />
<script src="<c:url value="resources/bootstrap/js/jquery.min.js"/>"></script>
<!-- bootstrap JavaScript -->
<script type="text/javascript" src="<c:url value="resources/bootstrap/js/bootstrap.min.js"/>"></script>

<script>
		function formSubmit() {
			document.getElementById("logoutForm").submit();
		}
</script>

</head>
<style>
.navbar-nav.navbar-right:last-child {margin-right:0px}
.navbar-nav.navbar-right >li:hover{background-color: #e7e7e7}
.navbar-nav > li > a {
    padding-bottom: 28px;
    padding-top: 25px;
}
</style>
<body>
	<c:url value="/j_spring_security_logout" var="logoutUrl" />
	<form action="${logoutUrl}" method="post" id="logoutForm" style="visible:none;">
		<input type="hidden" name="${_csrf.parameterName}"
			value="${_csrf.token}" />
	</form>
<sec:authorize access="hasAnyRole('ROLE_USER','ROLE_ADMIN')">
<div class="container">

<div class="navbar navbar-default">
        <div class="container">
          <div class="navbar-header">
            <button data-target=".navbar-collapse" data-toggle="collapse" class="navbar-toggle collapsed" type="button" >
              <span class="sr-only">Toggle navigation</span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button> 
            
            <a href="#" class="brand"><img border="0" alt="CSC Logo" src="<c:url value="resources/img/csc_logo.png"/>"></a>
          </div><!--/.navbar-header-->
        	
           
          <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
              <li><a href="changePassword">Change Password</a></li>
              <li><a href="#">Help</a></li>
              
			<li><a href="javascript:formSubmit()"> Logout</a></li>
            </ul>
          </div><!--/.nav-collapse -->
        
        </div><!--/.navbar container-->
 </div><!--navbar default-->

	<div class="row">
		<div class="col-md-4 col-xs-4">
        	<div class="list-group">
                <a class="list-group-item active" href="#"> Account Info </a>
                <a class="list-group-item" href="changePassword">Change Password</a>
                <a class="list-group-item" href="#">View Transaction</a>
                <a class="list-group-item" href="#">Create Transaction</a>
            </div>
        </div><!--col-->
        <div class="col-md-8 col-xs-8">
            <div class="panel panel-primary">
                <div class="panel-heading">
                   	<h3 class="panel-title">Welcome Mr.David</h3>
                </div>
                                  
                  <!-- Table -->
				  <table class="table table-striped">
				   	<thead>
				   		<tr>
				   			<th>#</th>
				   			<th>First Name</th>
				   			<th>Last Name</th>
				   			<th>Balance</th>
				   		</tr>
				   	</thead>
				   	<tbody>
				   		<tr>
				   			<td>1</td>
				   			<td>David</td>
				   			<td>Johnson</td>
				   			<td>1000$</td>
				   		</tr>
				   	</tbody>
				  </table>
             </div>
        </div>
	</div><!--row-->
</div>
</sec:authorize>
</body>
</html>
